<template>
	<view class="x-img" >
		<u-image class="goods-banner" :width="width" :height="height"
			:src="!static?(src.indexOf('http')>-1?src:(baseImg+src)):src" :radius='radius' :mode='mode'
			:lazy-load="true">
			<template v-slot:loading>
				<view class="loading center" :style="{width,height}">
					<u-loading-icon :color="color"></u-loading-icon>
				</view>
			</template>
		</u-image>
	</view>
</template>

<script>
	export default {
		// 图片地址
		// src: {
		//     type: String,
		//     default: uni.$u.props.image.src
		// },
		props: {
			
			static: {
				type: Boolean,
				default: false
			},
			src: {
				type: String,
				default: uni.$u.props.image.src
			},
			mode: {
				type: String,
				default: ''
			},
			radius: {
				type: String,
				default: '0rpx',
			},
			width: {
				type: String,
				default: '750rpx'
			},
			height: {
				type: String,
				default: '500rpx'
			},
			color: {
				type: String,
				default: 'red'
			},
			httpImg: {
				type: String,
				default: ''
			},
		},
		name: "x-img",
		data() {
			return {
				baseImg: "",
			};
		},
		created() {
			const value = uni.getStorageInfoSync('image_domain')
			if (value) {
				this.baseImg = value
			}
		}
	}
</script>

<style lang="scss" scoped>
.loading{
	// position: fixed;
	// top: 0;
	// 	left: 0;
	// 	right: 0;
	// 	bottom: 0;
	
	
}
</style>